<template>
    <a-modal v-bind="defaultModalProps"
        v-model:open="open"
        title="面试反馈"
        :width="660"
        :body-style="{paddingBlock: '34px'}"
        :ok-button-props="{size:'large', loading}"
        :cancel-button-props="{size: 'large'}"
        @cancel="handleCancel"
        @ok="handleConfirm"
    >
        <a-flex :gap="12">
            <span class="text-secondary text-sm flex-none">面试结果</span>
            <RadioGroup v-model:value="formState.state">
                <a-space :size="56">
                    <Radio :value="EnumInterviewState.已通过">通过</Radio>
                    <Radio :value="EnumInterviewState.待定">待定</Radio>
                    <Radio :value="EnumInterviewState.不通过">未通过</Radio>
                </a-space>
            </RadioGroup>
        </a-flex>
        <a-flex :gap="12" class="mt-[30px]">
            <span class="text-secondary text-sm flex-none">面试反馈</span>
            <a-textarea v-model:value="formState.result" :auto-size="{minRows:6}" placeholder="请输入反馈内容" style="width: 100%;" />    
        </a-flex>
    </a-modal>
</template>
<script lang="ts" setup>
import { RadioGroup, Radio, message } from 'ant-design-vue';
import { defaultModalProps } from '@/constants/comp-setting';
import { type Exposed, type FormState } from "./types";
import { postMychatInterviewfeedbackInterviewId } from '@/api/siderBar/myChat';
import { EnumInterviewState } from '@/api/siderBar/model';

defineOptions({
    name: "InterviewFeedBack",
    inheritAttrs: false
})
defineExpose<Exposed>({
    open({interviewId}) {
        open.value = true
        interviewIdRef.value = interviewId
    },
})
const emit = defineEmits<{
    success: []
}>()
const open = ref(false)
const loading = ref(false)
const interviewIdRef = ref()
const formState = ref(getInitialState())
function getInitialState(): FormState {
    return {
        state: EnumInterviewState.已通过
    }
}
function handleCancel() {
    open.value = false
    loading.value = false
}
async function handleConfirm() {
    try {
        loading.value = true
        await postMychatInterviewfeedbackInterviewId(toValue(interviewIdRef), toValue(formState))
        loading.value = false
        handleCancel()
        message.success("反馈成功")
        emit("success")
    } catch (error) {
        console.error(error)
        loading.value = false
    }
}
</script>